<style>
        #mydialog {
            position: fixed;
            left: 0;
            top: 0;
            font-size: 13px;
            font-family: 'Microsoft Yahei', Arial, sans-serif;
            z-index: 999998;
            height: 100%;
            width: 100%;
            display: none;
        }
    
        #mydialog .overlay.light {
            background-color: #666;
        }
    
        #mydialog .overlay.light {
            background-color: #666;
        }
    
        #mydialog .overlay {
            opacity: .7;
            position: relative;
            z-index: 999999;
            width: 100%;
            height: 100%;
            display: none;
        }
    
        #mydialog .contentWindow.light {
            color: #000;
            background-color: #fff;
            border: 1px solid #f0f0f0;
        }
    
        #mydialog .contentWindow {
            text-align: center;
            position: absolute;
            z-index: 1000000;
            margin: auto;
            left: 40px;
            right: 40px;
            border-radius: 5px;
            overflow: hidden;
            -webkit-animation: zoomIn .1s 1 ease-in-out;
            animation: zoomIn .1s 1 ease-in-out;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
        }
    
        #mydialog .contentWindow .title {
            padding: 5px 10px 0;
            font-weight: bold;
            font-size: 16px;
        }
    
        #mydialog .contentWindow .content {
            font-size: 14px;
            margin: 10px 5px;
            overflow-y: auto;
        }
    
        #mydialog .light .buttons {
            border-top: 1px solid #f0f0f0;
        }
    
        #mydialog .light .buttons div {
            border-right: 1px solid #f0f0f0;
            color: #017afd;
        }
    
        #mydialog .contentWindow .buttons div {
            position: relative;
            display: table-cell;
            margin-right: 10px;
            padding: 8px 10px;
            font-size: 16px;
            width: 1%;
        }
    
        #mydialog .contentWindow .buttons div:last-child {
            border-right: 0;
        }
    
    
    #myinputtext{
      box-sizing: border-box;
      /* text-align:center; */
      font-size:1em;
      height:2.7em;
      border-radius:0px;
      border-left-width: 0px;
      border-right-width: 0px;
      border-top-width: 0px;
      border-bottom:1px solid #c8cccf;
      color:#6a6f77;
      -web-kit-appearance:none;
      -moz-appearance: none;
      display:block;
      outline:none;
      outline:medium;
      padding:0 1em;
      text-decoration:none;
      width:100%;
    }
    #myinputtext::-webkit-input-placeholder{
      font-size: 0.9em;
      color: yellowgreen;
    }
    #myinputtext:focus{
        border-bottom:1px solid blue;
        border-left-width: 0px;
        border-right-width: 0px;
        border-top-width: 0px;
    }
    </style>
    <script>
        /*alert弹出层*/
        function jqalert(param) {
            var title = param.title,
                content = param.content,
                yestext = param.yestext,
                notext = param.notext,
                yesfn = param.yesfn,
                nofn = param.nofn,
                nolink = param.nolink,
                yeslink = param.yeslink,
                prompt = param.prompt,
                click_bg = param.click_bg;
    
            if (yestext === undefined) {
                yestext = '是';
            }
            var html = '';
            html += '<div id="mydialog" global="0" style="display: block;">';
            html += '<div id="mydialog_overlay" class="light overlay" style="display: block;"></div>';
            html += '<div class="light contentWindow" style="top: 238.7px;">';
            if (title){
                html += '<div class="title">'+title+'</div>';
            }
            if (prompt) {
                html += '<div class="content" style="max-height: 396px;">';
                html += '<input type="text" id="myinputtext" value="" placeholder="'+prompt+'"/>';
                html += '</div>';
    
            }else{
                html += '<div class="content" style="max-height: 396px;">'+content+'</div>';
            }
           
            html += '<div class="buttons">';
            if (notext) {
                html += '<div id="mybtn_cancel">'+notext+'</div>';
            }
            html += '<div id="mybtn_confirm">'+yestext+'</div>';
            html += '</div>';
            html += '<div class="close"></div>';
            html += '</div>';
            html += '</div>';
            $('body').append(html);
            var al = $('#mydialog');
            al.on('click', '#mybtn_cancel', function () {
                al.remove();
                if (nofn) {
                    param.nofn();
                    nofn = '';
                }
                param = {};
            });
            al.delegate('#mydialog_overlay', 'click', function (event) {
                event.stopPropagation();
            });
            al.delegate('#mybtn_confirm', 'click', function () {
                setTimeout(function () {
                    al.remove();
                }, 300);
                if (yesfn) {
                   var a= param.yesfn();
                    yesfn = '';
                }
                param = {};
            });
        }
    </script>
  <script>

        function show() {
            jqalert({
                title: '外勤申请确认',
                prompt: '请输入外勤地点或外勤事由',
                yestext: '是',
                notext: '否',
                yesfn: function () {
                   alert( $('#myinputtext').val());
                    alert('提交成功');
                },
                nofn: function () {
                    alert('你点击了取消');
                }
            });
        }
    </script>
